<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/7/31
  Time: 11:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>首页</title>
    <script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    <script type="text/javascript">
        function doLogin() {
            //1.获取到用户名和密码
            //2.发送ajax请求到后台

            var userEmail = $("#userEmail").val();
            var password = $("#password").val();

            //通过jquery发送ajax请求，并且接收响应
            $.ajax({
                url:"login",
                //data:"username="+username,
                data:{"userEmail":userEmail,"password":password},
                type:"post",
                dataType:"json",//告诉jquery，响应回来的是json
                success:function (data) {
                    //如果我们自己在后台写代码，把一个json串以响应输出流的方式写过了的化，data就是一个字符串
                    //如果是struts对json支持的方式响应回来的，会带有数据类型；jquery会自动处理；data是一个js对象
                    alert(data);
                    console.log(data)
                }
            });
        }
    </script>
</head>
<body>
    <div>这里有很多从数据库中获取到的内容，很多很多....</div>
    这也是数据库中获取到的内容
    <span id="loginSpan">
        用户名：<input id="userEmail"/>
        密码：<input id="password" type="password"/>
        <input type="button" value="登录" onclick="doLogin()"/>
    </span>
    这也是。。。。
    <div>这里有很多从数据库中获取到的内容，很多很多....</div>

</body>
</html>
